
//图片裁剪

(window.onresize = function () {
    var win_height = $(window).height();
    var win_width = $(window).width();
    if (win_width <= 768){
        $(".tailoring-content").css({
            "top": (win_height - $(".tailoring-content").outerHeight())/2,
            "left": 0
        });
    }else{
        $(".tailoring-content").css({
            "top": (win_height - $(".tailoring-content").outerHeight())/2,
            "left": (win_width - $(".tailoring-content").outerWidth())/2
        });
    }
})();

//弹出图片裁剪框
$("#replaceImg").on("click",function () {
    $(".tailoring-container").toggle();
});
//图像上传
function selectImg(file) {
    if (!file.files || !file.files[0]){
        return;
    }
    var reader = new FileReader();
    reader.onload = function (evt) {
        var replaceSrc = evt.target.result;
        //更换cropper的图片
        $('#tailoringImg').cropper('replace', replaceSrc,false);//默认false，适应高度，不失真
    }
    reader.readAsDataURL(file.files[0]);
}
//cropper图片裁剪
$('#tailoringImg').cropper({
    aspectRatio: 1/1,//默认比例
    preview: '.previewImg',//预览视图
    guides: false,  //裁剪框的虚线(九宫格)
    autoCropArea: 0.5,  //0-1之间的数值，定义自动剪裁区域的大小，默认0.8
    movable: false, //是否允许移动图片
    dragCrop: true,  //是否允许移除当前的剪裁框，并通过拖动来新建一个剪裁框区域
    movable: true,  //是否允许移动剪裁框
    resizable: true,  //是否允许改变裁剪框的大小
    zoomable: false,  //是否允许缩放图片大小
    mouseWheelZoom: false,  //是否允许通过鼠标滚轮来缩放图片
    touchDragZoom: true,  //是否允许通过触摸移动来缩放图片
    rotatable: true,  //是否允许旋转图片
    crop: function(e) {
        // 输出结果数据裁剪图像。
    }
});
//旋转
$(".cropper-rotate-btn").on("click",function () {
    $('#tailoringImg').cropper("rotate", 45);
});
//复位
$(".cropper-reset-btn").on("click",function () {
    $('#tailoringImg').cropper("reset");
});
//换向
var flagX = true;
$(".cropper-scaleX-btn").on("click",function () {
    if(flagX){
        $('#tailoringImg').cropper("scaleX", -1);
        flagX = false;
    }else{
        $('#tailoringImg').cropper("scaleX", 1);
        flagX = true;
    }
    flagX != flagX;
});

//裁剪后的处理
$("#sureCut").on("click",function () {
    if ($("#tailoringImg").attr("src") == null ){
        return false;
    }else{
        var cas = $('#tailoringImg').cropper('getCroppedCanvas');//获取被裁剪后的canvas
        var base64url = cas.toDataURL('image/png'); //转换为base64地址形式
        $("#finalImg").prop("src",base64url);//显示为图片的形式

        //关闭裁剪框
        closeTailor();
    }
});
//关闭裁剪框
function closeTailor() {
    $(".tailoring-container").toggle();
}





$(function() {
    $(".pic").click(function () {
        $(this).parent().find(".upload").click(); //隐藏了input:file样式后，点击头像就可以本地上传
        $(this).parent().find(".upload").on("change",function(){
            var objUrl = getObjectURL(this.files[0]) ; //获取图片的路径，该路径不是图片在本地的路径
            if (objUrl) {
                $(this).parent().find(".pic").attr("src", objUrl) ; //将图片路径存入src中，显示出图片
            }
        });
    });
});

function getObjectURL(file) {
    var url = null ;
    if (window.createObjectURL!=undefined) { // basic
        url = window.createObjectURL(file) ;
    } else if (window.URL!=undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file) ;
    } else if (window.webkitURL!=undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file) ;
    }
    return url ;
};


$(document).ready(function(){
    $.ajax({
       type:'post',
        url:'/tutor-game',
        success:function (res) {
           $.each(res.data,function (i,v) {
               $("#tutor-test").append(`
            <option value="${v.G_id}">${v.G_names}</option>
            `)
           })
        }
    });
    $.ajax({
        type:'post',
        url:'/apply',
        data:{
         id:localStorage.myID
        },
        success:function (res) {
            $("#finalImg").attr("src",res.data[0].U_photo);
            $("#jb-neckname").val(res.data[0].U_falsename);
            $("#QQ").val(res.data[0].U_qq);
            $("#phone").val(res.data[0].U_tel);

        }
    })
});
$("#tutor_btn").click(function () {
   if (!$("#finalImg").attr('src')||$("#jb-neckname").val() ||$("#IDname").val()||$("#IDnum").val()||$("#QQ").val()||$("#pic2").attr('src')||$("tutor-level").val()||$("price").val()||$("#tutor-test").val()||$("#peron-con").val()||$("#pic3").attr('src')) {
    alert("不能为空")
   }else {
       $.ajax({
           type:'post',
           url:'/playerinfo1',
           data:{
               id:localStorage.myID,
               src1:$("#finalImg").attr('src'),
               neckname:$("#jb-neckname").val(),
               sex: $('input[name="sex"]:checked').val(),
               IDname:$("#IDname").val(),
               IDnum:$("#IDnum").val(),
               tel:$("#phone").val(),
               qq:$("#QQ").val(),
               src2:$("#pic2").attr('src'),
           },
       });
       $.ajax({
           type:'post',
           url:'/playerinfo2',
           data:{
               id:localStorage.myID,
               level:$("tutor-level").val(),
               price:$("price").val(),
               game:$("#tutor-test").val(),
               person:$("#peron-con").val(),
               src:$("#pic3").attr('src')
           },
           success:function (res) {
               if (!error) {
                   alert("提交成功")
               }
           }
       })

   }

})